<html>
<head>

<script type="text/javascript">
		var aJaxURL	= "server-side/report/Month_client.action.php";		//server side folder url
		var tName	= "report";

		$(document).ready(function () {
			maketabele();
			LoadTable();
			});
		function LoadTable(){
			var table = $('#report').DataTable();
			table
			    .clear();
			  //  .draw();

				var start	= $("#search_start").val();
		    	var end		= $("#search_end").val();
				//var total = [7, 8, 9, 10, 11, 12, 13, 14, 15, 16];
				//GetDataTable(tname, aJaxURL, action, count, data, hidden, length, sorting, sortMeth, total)
				//alert("sd");
		    	GetDataTable_st(tName, aJaxURL, "get_list", 51, "start="+start+"&end="+end, 0);


			  //  new $.fn.dataTable.FixedColumns( table1 );
		 }

	    $(document).on("change", "#search_start", function () {
		    var code 	= '';
	    	var start	= $("#search_start").val();
		    var op=new Array();
	    	op[1]  =		'<option value="1">იანვარი </option>';
	    	op[2]  =		'<option value="2">თებერვალი</option>';
	    	op[3]  =		'<option value="3">მარტი</option>';
	    	op[4]  =		'<option value="4">აპრილი</option>';
	    	op[5]  =		'<option value="5">მაისი</option>';
	    	op[6]  =		'<option value="6">ივნისი</option>';
	    	op[7]  =		'<option value="7">ივლისი</option>';
	    	op[8]  =		'<option value="8">აგვისტო</option>';
	    	op[9]  =		'<option value="9">სექტემბერი</option>';
	    	op[10]  =		'<option value="10">ოქტომბერი</option>';
	    	op[11]  =		'<option value="11">ნოემბერი</option>';
	    	op[12]  =		'<option value="12">დეკემბერი</option>';
	    	while(start<13){
	    		code+=op[start];
	    		start++;
		    	};
	    	$("#search_end").html(code);
	    	maketabele();

	    });
	    $(document).on("change", "#search_end", function () {maketabele();});
	    function maketabele(){
		    var i=0;
	    	var start	= $("#search_start").val();
	    	var end		= $("#search_end").val();
		    var code   	='<th style="display: none">--ID--</th><th style="width: 200px !important;">კლიენტი</th>';
		    var code1 	='<th>&nbsp;</th><th>&nbsp;</th>';
		    var tve= new Array();
		    tve[0] 		='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">იანვარი</th>';
		    tve[1] 		='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">თებერვალი</th>';
		    tve[2] 		='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">მარტი</th>';
		    tve[3] 		='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">აპრილი</th>';
		    tve[4] 		='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">მაისი</th>';
		    tve[5] 		='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">ივნისი</th>';
		    tve[6] 		='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">ივლისი</th>';
		    tve[7] 		='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">აგვისტო</th>';
		    tve[8] 		='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">სექტემბერი</th>';
		    tve[9] 		='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">ოქტომბერი</th>';
		    tve[10] 	='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">ნოემბერი</th>';
		    tve[11] 	='<th style="border-left:2px #349ed5 solid; !important;" colspan="4">დეკემბერი</th>';
		    //alert(end+"-"+start);
		    start--;
		    while(end>start){
			    code+=tve[start];
			    code1+='<th>კარტრიჯების <br/> რ-ბა</th><th>თანხა</th><th>Δ აკარტრიჯების <br/> რ-ბა</th><th>Δ თანხა</th>';
			    start++;
			    i++;
			    }
		//    alert(code);
		    $("#datatable_header1").html(code);
		    $("#datatable_header2").html(code1);
		    LoadTable();
		 //   alert(i);
		    $("#"+tName).width(624+i*400+"px");

		    }
	 function   statistic(t){
			i=0;
			j=3;
			var start	= $("#search_start").val();
	    	var end		= $("#search_end").val();


		 var series= new Object();
		 var dt= new Object();
		 var data= new Object();
		 series=[{ name:'', data: data[0]},{name:'',data:''},{name:'',data:''},{name:'',data:''},{name:'',data:''},{name:'',data:''},{name:'',data:''},{name:'',data:''},{name:'',data:''},{name:'',data:''}];
	//	 	while(end>start){
		   dt[0]=parseInt(t[0][3]),
		   dt[1]=parseInt(t[0][7]),
		   dt[2]=parseInt(t[0][12]);
		//   start++;
		//    }
		 while(i<10){
			 series[i].name=t[i][1];
			 series[i].data=[parseInt(t[i][3]),parseInt(t[i][7]),parseInt(t[i][12])];
			 i++;
			 }


		console.log(series[1].data);
		console.log(dt);
	//	 alert( series[0]['name']+' ---- '+series[1].name);
		 var chart = new Object();
		 chart.chart={ type: 'line'},
		 chart.title={ text: 'Monthly Average Temperature'},
		 chart.subtitle= { text: 'Source: WorldClimate.com'},
		 chart.xAxis= {categories: ['იანვარი', 'თებერვალი', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] },
		 chart.yAxis= {title: {	text: 'Temperature (°C)' }  },
		 chart.plotOptions= {line: {  dataLabels: {  enabled: true  },
	               			 enableMouseTracking: false   } },
		 chart.series=series;


		 $('#container12').highcharts(chart);
		 };

</script>
<style type="text/css">
.ui-datepicker-calendar {
    display: none;
    }
th:nth-child(4n+3) {border-left:2px #349ed5 solid; !important;}
td:nth-child(4n+3) {border-left:2px #349ed5 solid; !important;}
</style>



</head>

<body>
	<div id="dt_example" class="ex_highlight_row clear_box">
		<div id="container" >
		<div id="dynamic">
		<h2 align="center">კარტრიჯების ისტორია</h2>
				<div id="button_area">
					<div class="left" style="width: 250px;">
						<label for="search_start" class="left"
							style="margin: 5px 0 0 9px;">დასაწყისი</label>
							<select name="search_start" id="search_start"
							class="inpt right"
							style="padding: 0px !important; height: 25px !important;">
							<option value="0">აირჩიეთ თვე</option>
							<option value="1">იანვარი </option>
							<option value="2">თებერვალი</option>
							<option value="3">მარტი</option>
							<option value="4">აპრილი</option>
							<option value="5">მაისი</option>
							<option value="6">ივნისი</option>
							<option value="7">ივლისი</option>
							<option value="8">აგვისტო</option>
							<option value="9">სექტემბერი</option>
							<option value="10">ოქტომბერი</option>
							<option value="11">ნოემბერი</option>
							<option value="12">დეკემბერი</option>
							</select>

					</div>
					<div class="right" style="width: 260px;">
						<label for="search_end" class="" style="margin: 5px 0 0 9px;">დასასრული</label>
							<select name="search_end" id="search_end"
							class="inpt right"
							style="padding: 0px !important; height: 25px !important;">
							</select>
					</div>
				</div>

				<table id="report" class="display  center_td" style="height: 99px;">
					<thead>
					<tr id="datatable_header1">
					</tr>
					<tr class="search_header2" id="datatable_header2" style="height: 20px">
					</tr>
					</thead>
				<!-- <tfoot class="center_price">
						<tr>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
							<th>&nbsp;</th>
						</tr>
					</tfoot>
					-->
				</table>
			</div>
			<div class="spacer"></div>
		</div>
<div id="container12" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

	</div>

	<!-- jQuery Dialog -->

</body>
</html>